import React, { useState } from 'react'
import { ResultPage, Card ,Input, Button} from 'antd-mobile'
import { useNavigate } from 'react-router-dom'
function Index() {
  const [start,Setstart]=useState()
  const [end,SetEnd]=useState()
  const nav=useNavigate()
  const handleClick=()=>{
    nav(`/list?start=${start}&end=${end}`)
  }
  return (
    <div>
      <ResultPage
      status=''
      title=''
      description=''
    >
      <ResultPage.Card style={{ padding: 8 }}>
         <Input
          placeholder='请输入出发地'
          value={start}
          onChange={start => {
            Setstart(start)
          }}
        />
        <Input
          placeholder='请输入目的地'
          value={end}
          onChange={end => {
            SetEnd(end)
          }}
        />
        <Button onClick={()=>handleClick()} type='submit' color='primary' block>搜索</Button>
      </ResultPage.Card>

      <Card style={{ height: 128, marginTop: 12 }}>搭配 Card 使用</Card>
    </ResultPage>
    </div>
  )
}

export default Index